import { getCourseListRequest } from '../../api/main';
import { getNowWeek } from '../../utils/util';

const courseCacheKey = "courses"
const courseColorCacheKey = "courseColor"

Page({
  data: {
    nowWeek: 1, // 当前周,头部<text>第{{nowWeek}}周</text>
    totalWeek: 20, // 周总数
    showSwitchWeek: false, // 显示选择周数弹窗
    weekDayCount: 7,  // 一周的天数
    startDate: '2024/09/20', // 开学日期
    weekIndexText: ['一', '二', '三', '四', '五', '六', '日'],  // 星期的中文表示
    nowMonth: 1, // 当前周的月份， (nowMonth == 12 ? 1 : (nowMonth + 1)
    // name:'高等数学A'，rawWeeks:1-18，week:2， sectionCount:2
    courseList: [],
    colorList: [
      "#116A7B",
      "#DD58D6",
      "#30A2FF",
      "#0079FF",
      "#F79327",
      "#47A992",
      "#7A3E3E",
      "#FF55BB",
      "#A0D8B3",
      "#539165",
      "#3A98B9",
      "#609966",
    ],//  一系列颜色，用于给课程分配颜色
    courseColor: {},  // 每个课程的颜色映射
    weekCalendar: [1, 2, 3, 4, 5, 6, 7],  // 当前周的每一天在月份中的日期（具体为月份中的第几天）
    firstEntry: true  // 标识是否是首次进入页面
  },

  onLoad(options) {
    // windowWidth 属性表示手机屏幕的宽度（px）; const windowWidth =  wx.getSystemInfoSync().windowWidth; 后面wxml的style用到
    const { windowWidth } = wx.getSystemInfoSync()
    this.setData({
      windowWidth
    })
    this.getWeekDates()  // 计算并设置当前周的日期信息 nowMonth, weekCalendar（具体为月份中的第几天）
    this.getNowWeekC() // 获取并设置当前周数 nowWeek
    this.getDate()     // 获取课程数据
    this.getTodayDate()  // 获取今天的日期 todayMonth, todayDay
  },

  // 获取时间 接受Date对象作为参数。未提供参数，使用 new Date(); 处理日期对象，返回年、月、日;
  getDateObject(date = new Date()){
    const year = date.getFullYear()
    const month = date.getMonth()+1
    const day = date.getDate() // 月份中的第几天
    return{ 
      year,
      month,
      day,
    }
  },

  // 获取并设置今天的月份和日期  todayMonth, todayDay
  getTodayDate(){
    // 使用解构赋值将 month 属性赋值给 todayMonth，day 属性赋值给 todayDay
    const { month: todayMonth, day: todayDay} = this.getDateObject()
    this.setData({
      todayMonth,
      todayDay,
    })
  },

  // 计算并设置当前周的日期信息 nowMonth, weekCalendar（具体为月份中的第几天）
  getWeekDates() {
    const startDate = new Date(this.data.startDate) // 获取开学日期并转换为 Date 对象
    const addTime = (this.data.nowWeek - 1) * 7 * 24 * 60 * 60 * 1000 // 计算从开学到当前周（this.data.nowWeek）的总毫秒数
    const firstDate = new Date(startDate.getTime() + addTime) // 通过在 startDate 上添加 addTime 来得到当前周的第一天
  
    // 以开学日期为基准：如果开学日期是星期二，那么第一周的第一天就是星期二
    // 得到当前周的第一天是星期几（0-6，0代表星期日）
    const firstWeekDay = firstDate.getDay() 
    // 计算从当前周的第一天调整到下一个星期一需要增加的天数
    // 7 - firstWeekDay: 这是为了计算从当前周的第一天到星期六（如果当前周的第一天是星期日，则firstWeekDay = 0，7 - 0 = 7）的距离
    // + 1: 这里的 + 1 是因为我们实际上要调整到下一个星期一，而不是当前周的星期六。+ 1 使我们越过星期六，进入下一个星期一
    const adjustDays = firstWeekDay === 0 ? 1 : (7 - firstWeekDay + 1)  
    // 将日期调整到星期一
    const adjustedFirstDate = new Date(firstDate.getTime() + adjustDays * 24 * 60 * 60 * 1000)
  
    const weekCalendar = []
    // 生成的是当前周内第 i 天的日期
    for(let i = 0; i < this.data.weekDayCount; i++){
      // .getTime() 方法返回这个日期对象从1970年1月1日00:00:00 UTC以来的毫秒数
      const date = new Date(adjustedFirstDate.getTime() + i * 24 * 60 * 60 * 1000)
      weekCalendar.push(date.getDate()) // 只存日期
    }
    this.setData({
      nowMonth: adjustedFirstDate.getMonth() + 1,
      weekCalendar,
    });
  },

  // 使用工具函数计算并设置当前周数 ; getWeek用于计算当前日期相对于一个开始日期的星期数，并且在总周数达到后重置到 1
  getNowWeekC(){
    const nowWeek = getNowWeek(this.data.startDate, this.data.totalWeek)
    this.setData({
      nowWeek
    })
    this.getWeekDates() // 计算并设置当前周的每一天在月份中的日期
  },

  // getData() 函数是一个数据获取和缓存管理函数,它优先从本地缓存读取数据，提高性能；如果缓存不存在，则从远程获取数据，并更新缓存
  getDate(){
    const cache = wx.getStorageSync(courseCacheKey)
    const courseColorCache = wx.getStorageSync(courseColorCacheKey)
    // 判断本地存储中是否存在课程数据缓存
    if(cache){
      this.setData({
        courseList: cache
      })
      if(!courseColorCache){
        this.buildCourseColor()
      }else{
        this.setData({
          courseColor: courseColorCache
        })
      }
      return  // 如果缓存数据存在，则直接返回，不再执行后续操作
    } // if
    this.updateFn(true)  // 如果缓存不存在，则调用 updateFn函数
  },

  // 刷新页面
  updateFn(firstEntry = false){
    const that = this
    getCourseListRequest().then(res => { 
      that.setData({
        courseList: res.data
      })
      that.buildCourseColor()
      if(!firstEntry){
        wx.showToast({
          title: '更新成功',
          icon: 'success'
        })
      }
      wx.setStorageSync(courseCacheKey, res.data)
    }) // getCourseListRequest
  },

  // 处理滑动切换周的逻辑
  // e.detail.source属性表示切换页面的来源, e.detail.source为空字符串表示Swiper的页面切换是由程序代码（而不是用户手动滑动）引起的
  swiperSwitchWeek(e){
    if(e.detail.source == ''){
      this.setData({
        firstEntry: false
      })
      return
    }
  },

  // 导航到课程详情页面
  navCourseDetail(e){
    const index = e.currentTarget.dataset.index
    wx.navigateTo({
      url: `/pages/course-detail/index?info=${JSON.stringify(this.data.courseList[index])}`,
    })
  },

  // 为课程列表中的每门课程分配一个颜色，并将其存储到本地缓存和页面数据中
  buildCourseColor(){
    const courseColor = {}
    let colorIndex = 0
    this.data.courseList.map(item => {
      if(courseColor[item.name] === undefined){
        courseColor[item.name] = this.data.colorList[colorIndex]
        colorIndex++
      }
    }) //map
    wx.setStorageSync(courseColorCacheKey, courseColor)
    this.setData({
      courseColor
    })
  },

  // 打开弹窗 -- 头部
  selectWeek(){
    this.setData({
      showSwitchWeek: true // 显示选择周数弹窗
    })
  },

  // 弹窗
  switchWeek(e){
    const week= e.currentTarget.dataset.week
    this.setData({
      showSwitchWeek: false // 显示选择周数弹窗
    })
    this.switchWeekFn(week)
  },

  // 切换周数
  switchWeekFn(week){
    this.setData({
      nowWeek: week // 当前周
    })
    this.getWeekDates()  // 计算并设置当前周的每一天在月份中的日期
  },

  // 关闭弹窗
  hideSwitchWeek() {
    this.setData({
      showSwitchWeek: false
    })
  },

})